<template>
  <view v-if="isShow" class="dialog">
    <view class="bg"></view>
    <view class="title">服务协议和隐私政策</view>
    <view class="content">
      请你务必审慎阅读、充分理解“服务协议”和“隐私政策”各条款，包括但不限于：为了更好的向你提供服务，我们需要收集你的设备标识、操作日志等信息用于分析、优化应用性能。你可阅读
      <text class="link" @click="linkClick(1)">《服务协议》</text>和
      <text class="link" @click="linkClick(2)">《隐私政策》</text>
      了解详细信息。如果你同意，请点击下面按钮开始接受我们的服务。
    </view>
    <view class="btn">
      <button @click="disagree">不同意并退出</button>
      <button @click="agree">同意</button>
    </view>
  </view>
</template>
<script>
export default {
  data() {
    return {
      refCode: '',
      isShow: false
    }
  },
  onLoad(option) {
    uni.getSystemInfo({
      success: (res) => {
        if (res.osName == 'ios') {
          if (uni.getStorageSync('agree')) {
            uni.reLaunch({
              url: '/pages/index/index'
            })
          }
          setTimeout(() => {
            this.isShow = true
          }, 2000)
          return
        }
        uni.reLaunch({
          url: '/pages/index/index'
        })
      }
    })
  },
  methods: {
    linkClick(num) {
      if (num == 1) {
        uni.navigateTo({
          url: '/universal/webcontent/webcontent?key=service_agreement'
        })
      } else {
        uni.navigateTo({
          url: '/universal/webcontent/webcontent?key=privacy_policy'
        })
      }
    },
    agree() {
      uni.setStorageSync('agree', 1) // 设置缓存，下次进入应用不再弹出
      uni.reLaunch({
        url: '/pages/index/index'
      })
    },
    disagree() {
      // #ifdef APP-PLUS
      plus.ios.import('UIApplication').sharedApplication().performSelector('exit')
      // #endif
    }
  }
}
</script>

<style lang="scss">
page {
  background: #fff;
  background-size: 750rpx 1334rpx;
  position: relative;
  z-index: 2;
  .bg {
    position: fixed;
    left: 0;
    top: 0;
    z-index: -1;
    background: rgba(0, 0, 0, 0.5);
    width: 750rpx;
    height: 100vh;
  }
}

// 弹窗样式
.dialog {
  margin: 0 auto;
  margin-top: calc(30vh);
  width: 600rpx;
  border-radius: 16rpx;
  background-color: #fff;

  .title {
    text-align: center;
    line-height: 80rpx;
    font-size: 32rpx;
    font-weight: 600;
  }

  .content {
    padding: 0 32rpx;
    text-indent: 1em;

    .link {
      color: #ff6840;
    }
  }

  .btn {
    display: flex;
    flex: 1;

    uni-button {
      margin: 0;
      flex: 1;
      background-color: #fff;
    }

    uni-button::after {
      border: none;
    }
  }
}
</style>
